<template>
  <div>
    <el-dialog
      :visible="true"
      title="编辑计划任务"
      class="add_task_dialog"
      width="40%"
      :before-close="callOf"
    >
      <el-form
        ref="form"
        :model="sizeForms"
        :rules="formrules"
        label-width="100px"
      >
        <el-form-item label="任务名称" prop="task_name">
          <el-input
            ref="task_name"
            v-model="sizeForms.task_name"
            class="add"
            placeholder="请输入任务名称"
          />
        </el-form-item>
        <el-form-item label="执行时机" prop="begin_time">
          <el-input
            ref="begin_time"
            v-model="sizeForms.begin_time"
            class="add"
            placeholder="请输入执行时机"
            :autosize="{ minRows: 2, maxRows: 4 }"
            type="textarea"
            :rows="2"
          />
        </el-form-item>
        <div />
        <el-form-item>
          <el-button
            type="primary"
            @click="dialogFormEdit('form')"
          >保存</el-button>
          <el-button type="primary" @click="callOf('form')">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>
<script>
import { Message } from 'element-ui'
import { editTask } from '@/api/task'

export default {
  name: 'EditTask',
  props: {
    // dialogAdd: Object,
    sizeForms: {
      type: Object,
      required: true
    }
  },
  data() {
    return {
      id: '',
      task_name: '',
      begin_time: '',
      sizeForm: {},
      formrules: {
        task_name: [
          { required: true, message: '任务名称不能为空', trigger: 'blur' }
        ],
        begin_time: [
          { required: true, message: '执行时机不能为空', trigger: 'blur' }
        ]
      }
    }
  },
  mounted() {},
  methods: {
    dialogFormEdit(form) {
      this.$refs[form].validate((valid) => {
        if (valid) {
          editTask({
            id: this.sizeForms.id,
            task_name: this.sizeForms.task_name,
            begin_time: this.sizeForms.begin_time,
            user_id: 1
          }).then((res) => {
            if (res.code === 20000) {
              Message.success(res.message)
              this.callOf()
              this.$parent.getList()
            } else {
              Message.error(res.message)
            }
          })
        } else {
          return false
        }
      })
    },
    callOf() {
      this.$emit('closePop')
    }
  }
}
</script>
<style>
.add {
  width: 100%;
}
</style>
